<template>
	<view>
		<cu-custom bgColor="bg-maincolor" :isBack="true">
			<block slot="content">
				申请列表
			</block>
		</cu-custom>
		<view>
			<view class="but">
				<view class="but1" :class=" index==TabCur? 'but_select':'but_noselect'" v-for="(item,index) in choicelist" :key='index'
				 @click="choice(index)">{{item}}</view>
				 <view class="cu-tag round bg-red sm red_icou">5</view>
			</view>
			
		</view>
		<view v-if="TabCur==0" class="list_box">
			<view class="studen_list" v-for="(item,index) in 6" :key='index'>
				<view class="cu-avatar round lg avat" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
				<view class="list_text">
					<view class="name_text">何成成</view>
					<view class="school_text">赣州师范高等专科学校</view>
				</view>
				<view class="lg text-gray cuIcon-right icou_right"></view>
			</view>
		</view>
		<view v-if="TabCur==1" class="list_box">
			<view class="studen_list" v-for="(item,index) in 5" :key='index'>
				<view class="cu-avatar round lg avat" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Morgana.png);"></view>
				<view class="list_text">
					<view class="name_text">李梅</view>
					<view class="school_text">赣州师范高等专科学校</view>
				</view>
				<view class="lg text-gray cuIcon-right icou_right"></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				TabCur: 0,
				choicelist: ['实习中', '新申请']
			}
		},
		methods: {
			choice(index) {
				this.TabCur = index;

			}
		}
	}
</script>

<style>
	.but {
		height: 60rpx;
		width: 470rpx;
		display: flex;
		margin: auto;
		margin-top: 30rpx;
		border-radius: 10rpx;
		border: blue 3rpx solid;
		text-align: center;
		/* color: #FFFFFF; */

	}

	.but1 {
		width: 50%;
		line-height: 60rpx;
		/* border-right: blue 2rpx solid; */
	}

	.but2 {
		width: 50%;
		line-height: 60rpx;
	}
	.red_icou{
		position: absolute;
		right: 128rpx;
		margin-top: -15rpx;
	}

	.but_select {
		background-color: rgb(59, 115, 246);
		color: #FFFFFF;
	}

	.but_noselect {
		color: rgb(59, 115, 246);
	}

	.list_box {
		margin-top: 35rpx;
	}

	.studen_list {
		display: flex;

		height: 175rpx;

		background-color: #FFFFFF;
		border-bottom: rgb(231, 231, 231) 2rpx solid;

	}

	.avat {
		margin-left: 30rpx;
		margin-top: 40rpx;

	}

	.list_text {
		margin-left: 30rpx;
		margin-top: 45rpx;
	}

	.name_text {
		font-size: 30rpx;
		color: rgb(51, 51, 51);
	}

	.school_text {
		font-size: 25rpx;
		color: rgb(102, 102, 102);
		margin-top: 15rpx;
	}

	.icou_right {
		position: absolute;
		right: 35rpx;
		line-height: 175rpx;
	}
</style>

